<script setup>
import {ref} from "vue"
import dayjs from "dayjs";
import { showToast } from "../../../utils/common";
import EditCategory from "./children/EditCategory.vue"
const goodsCloudObj = uniCloud.importObject("admin-product-category",{customUI:true})
const editDialog = ref(false);
const tableData = ref([]);
const loading = ref(false);
const handleAdd =()=>{
	editDialog.value = true;
}

const getData = async()=>{
	try{
		loading.value=true;
		let {errCode,data} = await goodsCloudObj.list();
		if(errCode!==0) return showToast("查询失败")
		tableData.value = data;
	}catch(err){
		console.log(err);
		showToast(err)
	}finally{
		loading.value=false;
	}
	
}

getData();
</script>

<template>
	<view class="fix-top-window">
		<view class="uni-header">
			<uni-stat-breadcrumb class="uni-stat-breadcrumb-on-phone" />
			<view class="uni-group">				
				<button class="uni-button" type="primary" size="mini" @click="handleAdd">{{$t('common.button.add')}}</button>						
			</view>
		</view>
		
		<view class="uni-container">
			<el-table v-loading="loading" :data="tableData" stripe border  style="width: 100%">
				<el-table-column prop="name" show-overflow-tooltip label="分类名称" width="200" />
				<el-table-column prop="description"  label="分类描述" />
				<el-table-column prop="sort"  label="排序" width="200" />
				<el-table-column label="发布日期">
					<template #default="scope">
						<div>
						  {{dayjs(scope.row.create_date).format("YYYY-MM-DD HH:mm") }}
						</div>
					</template>
				</el-table-column>
				
				<el-table-column label="操作" width="180">
					<template #default="scope">
						<div>
						  <el-button type="primary" @click="">{{$t("common.button.edit")}}</el-button>				  
						  <el-button type="danger" @click="">{{$t("common.button.delete")}}</el-button>					  
						</div>
					</template>
				</el-table-column>
			</el-table>
			
			
		</view>
		
		
		<el-dialog title="新增分类" width="800" v-model="editDialog" destroy-on-close 
		:close-on-click-modal="false" z-index="999">
			<EditCategory></EditCategory>
		</el-dialog>
	</view>
</template>

<style lang="scss" scoped>
	
</style>
